<template>
  <div class="login">
      <div class="login_container">
          <div class="login_wrapper"><h2>UNI-ADMIN</h2></div>
          <div class="login_wrapper_input">
              <input type="text" placeholder="请输入用户名" v-model="username">
              <input type="password" placeholder="请输入密码" v-model="password">
              <button class="login_den"
              @click="onClickLogin">立即登录</button>
          </div>
      </div>
  </div>
</template>

<script>
// import VueCookies from 'vue-cookies';
import Cookies from "vue-cookies";
import axios from "axios";
export default {
    data(){
        return{
            username:'',
            password:''
        }
    },
    methods: {
        onClickLogin(){
            // console.log("登录");
            axios.post('http://ceshi5.dishait.cn/admin/login',{
                username:this.username,
                password:this.password
            }).then((res)=>{
                console.log(res);
                 let token = res.data.data.token;
                if(res.status == 200){
                    var millisecond = new Date().getTime();
                    var expiresTime = new Date(millisecond + 60 * 1000 * 15);
                    this.$message.success("登录成功!000")
                    Cookies.set('token',token,{
                        expires:expiresTime
                    });
                    this.$router.push("/");
                }
            })
        }
    },
}
</script>

<style>
.login
{
    width: 100vw;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.login_container
{
    width: 30vw;
    height: 20rem;
    border: 1px solid black;
}
.login_wrapper
{
    width: 100%;
    height:20%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid black;
}
.login_wrapper_input
{
    width: 100%;
    height: 80%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.login_wrapper_input input
{
    width: 80%;
    height: 3rem;
}
.login_den
{
    width: 80%;
    height: 20%;
    background: rgb(36, 36, 243);
    color:white;
    border: 1px solid  rgb(36, 36, 243);
}
</style>